<mat-card fxFlex="50" *ngFor="let post of posts">
    <mat-card-header>
        <mat-card-title>
          <h1 class="mat-heading">{{post.title}}</h1>
        </mat-card-title>
        <mat-card-subtitle>{{post.author?.username||'user'}} &bull; {{post.createdDate|date:'short'}}</mat-card-subtitle>
    </mat-card-header>
    <!-- <img matCardImage src="Card wide image source"> -->
    <!-- <mat-card-content>
        Text content
    </mat-card-content> -->
    <mat-card-actions align="start">
        <a mat-button [routerLink]="['/post', 'edit', post.id]">
          edit
        </a>
        <a mat-button [routerLink]="['/post', 'view', post.id]">view</a>
    </mat-card-actions>
    <!-- <mat-card-footer>
        Footer
    </mat-card-footer> -->
</mat-card>
<button mat-fab (click)="addPost()" class="fab-bottom-right">
  <mat-icon>add</mat-icon>
</button>
